<template>
  <el-dialog v-if="dialogInfo.dialogVisible" v-model="dialogInfo.dialogVisible" :title="dialogInfo.title" width="540"
    @close="cancel" :close-on-click-modal="false">
    <view-setting :viewData="tableView" @confirm="submitClick" @update-table-view="updateTableView"></view-setting>
  </el-dialog>
</template>
<script setup lang="ts">
import { updateView } from '@/api/model/index'
import { ElMessage } from 'element-plus'
import { ref } from 'vue'
import viewSetting from '@/components/view-setting/index.vue'
const emits = defineEmits(['submitCb', 'updateView'])


const viewInfo = ref<any>({})
const tableView = ref<any[]>([])

/* 对话框基本信息 */
const dialogInfo = ref({
  loading: true,
  dialogVisible: false,
  title: '列表视图配置',
})

/* 打开创建弹窗 */
const openDialog = async (obj: any) => {
  viewInfo.value = { ...obj }
  tableView.value = obj.columns
  dialogInfo.value.dialogVisible = true
}

/* 保存信息 */
const submitClick = (data: any) => {
  const obj = { ...viewInfo.value, columns: data }
  updateView(obj).then((res: any) => {
    if (res.code === 0) {
      ElMessage.success('保存成功')
      emits('submitCb')
      dialogInfo.value.dialogVisible = false
    }
  })
}

/* 取消创建 */
const cancel = () => {
  dialogInfo.value.dialogVisible = false
}

const updateTableView = (data: any) => {
  console.log(tableView.value)
  tableView.value = data
  emits('updateView', data)
}

defineExpose({ openDialog })
</script>
<style scoped lang="scss"></style>
